<!DOCTYPE html>
<html lang="zh-cn">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
  <title>发布培训需求</title>


  <!-- Expand styles -->
  <link href="../css/app/app.css" rel="stylesheet">
  <link href="../css/app/default.css" rel="stylesheet">
  <link href="../css/mui/mui.css" rel="stylesheet">
  <link href="../css/mui/mui.picker.min.css" rel="stylesheet" />

</head>

<body>


  <!-- header -->
  <div class="margin-b-60">
    <div class="list-group patient-list1 margin-b-i10">
      <div class="list-cell text-cell list-cell1" onclick="selectTrainType()">
        <div class="web-box1 list-left">培训类型</div>
        <div class="web-box2 nk-s text-right list-right">
          <div class="display-flex align-items-center justify-content-center">
            <input type="text" placeholder="请选择" id="tranType" disabled>
            <input type="hidden" id="tranTypeCode">
            <img class="sele-icon" src="../img/next.png" />
          </div>
        </div>
      </div>
      <div class="list-cell text-cell list-cell1" onclick="selectStartTime()">
        <div class="web-box1 list-left">培训开始时间</div>
        <div class="web-box2 nk-s text-right list-right">
          <div class="display-flex align-items-center justify-content-center">
            <input type="text" placeholder="请选择" id="tranBeginTime" disabled>
            <img class="sele-icon" src="../img/next.png" />
          </div>
        </div>
      </div>
      <div class="list-cell text-cell list-cell1" onclick="selectEndTime()">
        <div class="web-box1 list-left">培训结束时间</div>
        <div class="web-box2 nk-s text-right list-right">
          <div class="display-flex align-items-center justify-content-center">
            <input type="text" placeholder="请选择" id="tranEndTime" disabled>
            <img class="sele-icon" src="../img/next.png" />
          </div>
        </div>
      </div>
      <div class="list-cell text-cell list-cell1" onclick="selectQuoteEndTime()">
        <div class="web-box1 list-left">报价截止时间</div>
        <div class="web-box2 nk-s text-right list-right">
          <div class="display-flex align-items-center justify-content-center">
            <input type="text" placeholder="请选择" id="quoteDeadline" disabled>
            <img class="sele-icon" src="../img/next.png" />
          </div>
        </div>
      </div>

    </div>
    <div class="list-group patient-list1 margin-b-i10">
      <!-- <div class="price-diff"> -->
      <div class="list-cell text-cell">
        <div class="web-box1 list-left">费用预算</div>
        <div class="web-box2 nk-s text-right list-right display-flex">
          <input type="tel" placeholder="请输入金额" onkeyup="priceCheck(this)" maxlength="10" id="budget">
          <span class="padding-l-5 font-15 black">元</span>
        </div>
      </div>
      <div class="list-cell text-cell">
        <div class="web-box1 list-left">培训人数</div>
        <div class="web-box2 nk-s text-right list-right display-flex">
          <input type="tel" placeholder="请输入培训人数" onkeyup="priceCheck(this)" id="tranPeopleNum">
          <span class="padding-l-5 font-15 black">人</span>
        </div>
      </div>
      <div class="list-cell text-cell">
        <div class="web-box1 list-left">培训主题</div>
        <div class="web-box2 nk-s text-right list-right display-flex">
          <input type="tel" placeholder="请输入培训主题" onkeyup="priceCheck(this)" id="title">
          <span class="padding-l-5 font-15 black">人</span>
        </div>
      </div>
      <div class="list-cell text-cell list-cell1">
        <div class="web-box1 list-left">培训主办方</div>
        <div class="web-box2 nk-s text-right list-right"><input type="text" placeholder="请输入培训主办方" id="tranSponsors">
        </div>
      </div>
      <div class="list-cell text-cell list-cell1">
        <div class="web-box1 list-left">培训联系人</div>
        <div class="web-box2 nk-s text-right list-right"><input type="text" placeholder="请输入培训联系人"
            id="tranConnectPersion">
        </div>
      </div>
      <div class="list-cell text-cell list-cell1">
        <div class="web-box1 list-left">联系电话</div>
        <div class="web-box2 nk-s text-right list-right">
          <input type="text" placeholder="请输入联系电话" id="connectPhone"  disabled> 
        </div>
        <span class="font-15 black margin-l-20 margin-r-20 w-50px edit-phone">修改</span>
      </div>
      <div class="list-cell text-cell list-cell1" onclick="showAddress()">
        <div class="web-box1 list-left">培训地点</div>
        <div class="web-box2 nk-s text-right list-right">
          <div class="display-flex align-items-center justify-content-center">
            <input type="text" placeholder="请选择" id="address" autocomplete="off" disabled>
            <img class="sele-icon" src="../img/next.png" />
          </div>
        </div>
      </div>
      <div class="list-cell text-cell list-cell1">
        <div class="web-box1 list-left">详细地址</div>
        <div class="web-box2 nk-s text-right list-right"><input type="text" placeholder="请输入详细地址" id="tranAddress">
        </div>
      </div>

    </div>
    <div class="widget-default widget-body margin-b-10">

      <div class="web-box1 list-left font-16 black">培训要求</div>
      <div class="list-right">
        <textarea class="no-margin info-textarea" type="text" placeholder="简单介绍一下你的培训要求吧！" id="details"></textarea>
      </div>

    </div>
  </div>
  <div class="save-btn hobby-footer1">
    <button type="button" class="mui-btn mui-btn-primary mui-btn-block bc-head" onclick="save()">发布</button>
  </div>
  <div class="dialog hide">
    <div class="mask"></div>
    <div class="dialog-content">
        <h3 class="title">请修改你的联系手机号码</h3>
        <p class="text">
            <input type="text" class="dialog-input" style="width: 100%;" placeholder="请输入您的手机号码" id="phoneNumber">
            <input type="text" class="dialog-input" style="width: 60%;" placeholder="请输入验证码" id="verifyCode">
            <button class="seed-btn">发送验证码</button>
        </p>
        <div class="btn-group">
            <div class="btn cancel-btn">取消</div>
            <div class="btn cancel-btn-save" style="color: #3F72FF;" >确定</div>
        </div>
    </div>
</div>

  <script src="../js/jquery.js"></script>
  <script src="../js/mui/mui.js"></script>
  <script src="../js/mui/mui.picker.min.js"></script>
  <script src="../js/layer.js"></script>
  <script src="../js/city.data-3.js"></script>
  <script src="../js/app/app-base.js"></script>
  <script src="../js/app/app-url.js"></script>
  <script src="../js/app/app-ajax.js"></script>
  <script src="../js/dsbridge.js"></script>
  <script>
    var edit_id = "";
    //省code
    var provinceCode = "";
    //市code
    var cityCode = "";
    //区code
    var countyCode = "";
    //培训类型选择
    var trainTypePicker = new mui.PopPicker();

    var tranDemand_Id = "";

    var mWait = 60; //验证码等待时间
    var pWait = 0; //验证码当前时间


    //时间选择
    var dtpicker = new mui.DtPicker({
      type: "datetime"
    })
    //地址选择
    var pickerAddress = new mui.PopPicker({
      layer: 3
    });
    $(document).ready(function () {


      pickerAddress.setData(cityData3);
      //获取培训类型
      getTrainType();




      tranDemand_Id = localStorage.getItem("tranDemand_Id");
      if (!isEmpty(tranDemand_Id)) {

        getDetail();
      } 

      dsBridge.register('setTel', function (tel) {
          
          $("#connectPhone").val(tel);
      })
 
    })

    function checkSMSVerifyCode(phoneNumber,verifyCode) {
            var data = {
                phoneNumber:phoneNumber,
                verifyCode:verifyCode
            }

            getServerData(url_checkSMSVerifyCode, data);

        }
        function sendVerifyCode() {
            var phoneNumber = $("#phoneNumber").val();
            if(isEmpty(phoneNumber)) {
                showToast("请输入手机号");
                return;
            }
            if (!checkPhone(phoneNumber)) {
                return;
            }
            var data = {
                phoneNumber:phoneNumber
            }
            getServerData(url_sendVerifyCode, data);
        }
        
        function saveVerifyCode() {
            var phoneNumber = $("#phoneNumber").val();
            var verifyCode =   $("#verifyCode").val();
            if(isEmpty(phoneNumber)) {
                showToast("请输入手机号");
                return;
            }
            if(isEmpty(verifyCode)) {
                showToast("请输入验证码");
                return;
            }

          

        }

    function getDetail() {
      var data = {
        id: tranDemand_Id
      }
      getServerData(url_trandemandmgr_queryDetail, data);
    }

    //获取培训类型
    function getTrainType() {
      var data = {
        pCode: 'TRAN_TYPE'
      }
      getServerData(url_businessdatamng_queryList, data);
    }

    //选择培训类型
    function selectTrainType() {
      trainTypePicker.show(function (item) {
        $("#tranType").val(item[0].text);
        $("#tranTypeCode").val(item[0].value);
      });
    }

    //选择培训开始时间
    function selectStartTime() {
      dtpicker.show(function (e) {
        $("#tranBeginTime").val(e.text);
      })
    }

    //选择培训结束时间
    function selectEndTime() {
      dtpicker.show(function (e) {
        $("#tranEndTime").val(e.text);
      })
    }

    //选择报价截止时间
    function selectQuoteEndTime() {
      dtpicker.show(function (e) {
        $("#quoteDeadline").val(e.text);
      })
    }

    //选择地址
    function showAddress() {
      pickerAddress.show(function (item) {
        provinceCode = emptyShow(item[0].value);
        cityCode = emptyShow(item[1].value);
        countyCode = emptyShow(item[2].value);
        var address = item[0].text + emptyShow(item[1].text) + emptyShow(item[2].text);
        $("#address").val(address);
      });
    }

    //保存
    function save() {
      // var publishDemandObj = strToJson(localStorage.getItem("publishDemandObj"));
      var tranTypeCode = $("#tranTypeCode").val();
      var tranBeginTime = $("#tranBeginTime").val();
      var tranEndTime = $("#tranEndTime").val();
      var quoteDeadline = $("#quoteDeadline").val();
      var budget = $("#budget").val();
      var tranPeopleNum = $("#tranPeopleNum").val();
      var title = $("#title").val();
      var tranSponsors = $("#tranSponsors").val();
      var tranConnectPersion = $("#tranConnectPersion").val();
      var tranAddress = $("#tranAddress").val();
      var connectPhone = $("#connectPhone").val();
      var details = $("#details").val();
      if (isEmpty(tranTypeCode)) {
        showToast("请选择培训类型");
        return;
      }
      if (isEmpty(tranBeginTime)) {
        showToast("请选择培训开始时间");
        return;
      }
      if (isEmpty(tranEndTime)) {
        showToast("请选择培训结束时间");
        return;
      }
      if (isEmpty(quoteDeadline)) {
        showToast("请选择报价截止时间");
        return;
      }
      if (isEmpty(budget)) {
        showToast("请输入费用预算");
        return;
      }
      if (isEmpty(title)) {
        showToast("请输入主题");
        return;
      }
      if (isEmpty(tranPeopleNum)) {
        showToast("请输入培训人数");
        return;
      }
      if (isEmpty())
        if (isEmpty(tranSponsors)) {
          showToast("请输入培训主办方");
          return;
        }
      if (isEmpty(tranConnectPersion)) {
        showToast("请输入培训联系人");
        return;
      }
      if (isEmpty(provinceCode)) {
        showToast("请选择培训地点");
        return;
      }
      if (isEmpty(tranAddress)) {
        showToast("请输入详细地址");
        return;
      }
      if (isEmpty(connectPhone)) {
        showToast("请输入联系电话");
        return;
      }
      var data = {
        id: tranDemand_Id,
        userAccId: getUserId(),
        title: title,
        tranPeopleNum: tranPeopleNum,
        connectPhone: connectPhone,
        tranTypeCode: tranTypeCode,
        tranBeginTime: tranBeginTime,
        tranEndTime: tranEndTime,
        quoteDeadline: quoteDeadline,
        budget: budget,
        tranPeopleNum: tranPeopleNum,
        tranSponsors: tranSponsors,
        tranConnectPersion: tranConnectPersion,
        provinceCode: provinceCode,
        cityCode: cityCode,
        countyCode: countyCode,
        tranAddress: tranAddress,
        details: details
      }
      getServerData(url_trandemandmgr_save, data);
    }

    function getServerDataSuccess(url, data) {
      switch (url) {
        case url_checkSMSVerifyCode:
            $("#connectPhone").val($("#phoneNumber").val());
            $('.dialog').addClass('hide')
            $("#phoneNumber").val('');
            $("#verifyCode").val('');
            break;
        case url_sendVerifyCode:
            verificationCodeTime();
            break;
        case url_trandemandmgr_queryDetail:
          data = data.data;
          $("#tranType").val(data.tranType.name);
          $("#tranTypeCode").val(data.tranType.code);
          $("#tranBeginTime").val(data.tranBeginTime);
          $("#tranEndTime").val(data.tranBeginTime);
          $("#quoteDeadline").val(data.quoteDeadline);
          $("#budget").val(data.budget);
          $("#tranPeopleNum").val(data.tranPeopleNum);
          $("#title").val(data.title);
          $("#tranSponsors").val(data.tranSponsors);
          $("#tranConnectPersion").val(data.tranConnectPersion);
          $("#connectPhone").val(data.tranConnectPersion);

          provinceCode = emptyShow(data.province.provinceCode);
          cityCode = emptyShow(data.city.cityCode);
          countyCode = emptyShow(data.county.countyCode);
          var address = data.province.provinceName + emptyShow((data.city.cityName) + emptyShow(data.county.countyName));
          $("#address").val(address);
          $("#tranAddress").val(data.tranAddress);
          $("#details").val(data.details);
        case url_businessdatamng_queryList:
          //培训类型
          data = data.data;
          var trainTypePickerArray = new Array();
          if (data != null && data.length > 0) {
            $.each(data, function (index, item) {
              var obj = {
                value: item.code,
                text: item.name
              }
              trainTypePickerArray.push(obj);
            })
          }
          trainTypePicker.setData(trainTypePickerArray);
          break;
        case url_trandemandmgr_save:
          //保存
          //信息框
          layer.open({
            content: "发布成功",
            btn: '确定',
            shadeClose: false,
            yes: function (index) {
              layer.close(index);
              dsBridge.call("saveClose", "");
            }
          });
          break;
        case url_trandemandmgr_queryList:
          break;
      }
    }


 //修改手机号码
        $('.edit-phone').click(function () {
            $('.dialog').removeClass('hide')
        })
        $('.cancel-btn').click(function () {
            $('.dialog').addClass('hide')
            $("#phoneNumber").val('');
            $("#verifyCode").val('');
        })

        $('.cancel-btn-save').click(function () {
            var phoneNumber = $("#phoneNumber").val();
            var verifyCode =   $("#verifyCode").val();
            if(isEmpty(phoneNumber)) {
                showToast("请输入手机号");
                return;
            }
            if(isEmpty(verifyCode)) {
                showToast("请输入验证码");
                return;
            }
            checkSMSVerifyCode(phoneNumber,verifyCode);
        })

        function verificationCodeTime() {
            $(".seed-btn").css("background", "#777");
            pWait = mWait;
            var interval = setInterval(function () {
                if (pWait == 0) {
                    $('.seed-btn').html("发送验证码")
                    $(".seed-btn").css("background", "#3F72FF");
                    clearInterval(interval);
                } else {
                    $(".seed-btn").html(pWait + 's');
                    pWait--;
                }

            }, 1000);
        }

        $('.seed-btn').click(function () {

            if ($('.seed-btn').html() == '发送验证码') {
                sendVerifyCode();
            }
        })
  </script>

</body>

</html>